<template>
  <el-upload
    class="upload-demo"
    drag
    action="https://jsonplaceholder.typicode.com/posts/"
    :on-success="handleSuccess"
    :file-list="fileList"
    multiple

  >
  <i class="el-icon-upload"></i>
  <div class="el-upload__text">{{ placeholder }}</div>
  </el-upload>
</template>

<script>
export default {
  props: {
    placeholder: {
      type: String,
      default: '点击或拖拽上传文件'
    }
  },
  data() {
    return {
      fileList: []
    }
  },
  methods: {
    handleSuccess(response, file) {
      this.fileList.push(file);
      this.$emit('input', this.fileList); // 绑定文件列表到父组件
    }
  }
}
</script>

<style scoped>
.upload-demo {
  border: 1px dashed #d9d9d9;
  padding: 20px;
  cursor: pointer;
  width: 100%;
}
</style>
